<template>
	<el-dialog :visible="dialogVisible" width="40%" :before-close="handleClose" custom-class="view-form-detail">
		<div class="scroll-wrapper">
			<iframe ref="iframe" allowTransparency="true" class="iframelink" width="100%" height="100%" :src="formRemotelinkurl"></iframe>
		</div>
	</el-dialog>
</template>

<script>
export default {
	components: {},
	props: {
		dialogVisible: {
			type: Boolean,
			default: () => false,
			required: true
		},
		formId: {
			type: Number,
			default: () => 0,
			required: true
		},
		detailId: {
			type: Number,
			default: () => 0,
			required: true
		}
	},
	data() {
		return {
			//拼接地址
			formRemotelinkurl: `${formUrl}/?id=${this.formId}&token=${localStorage.getItem(`zco_admin_token_${window.uid}`)}&url=${loginUrl}&detailId=${this.detailId}&template=0&hash=${new Date().getTime()}`
		};
	},
	mounted() {},
	methods: {
		handleClose() {
			this.$emit('close');
		}
	}
};
</script>

<style lang="less" scoped>
.view-form-detail {
	.info-box {
		.no {
			color: #333;
			font-size: 14px;
			font-weight: 700;
		}
		.person-info {
			padding: 10px 0;
		}
	}
	.iframelink {
		width: 100%;
		height: 100%;
		min-height: 600px;
	}

	.scroll-wrapper {
		overflow: hidden;
		width: 100%;
		height: 100%;
	}
}
</style>
